<template>
  <div>
    <div class="add">
      编号:<input type="text" v-model="inputNode" /> 品牌名称:<input
        type="text"
        v-model="inputName"
      />
      <button @click="addlist">添加</button>
    </div>

    <div class="add">
      品牌名称:<input type="text" placeholder="请输入搜索条件" 
      v-model="serachContain"
      @input="searchipt"/>
    </div>
  </div>
</template>


<script>
export default {
  data() {
    return {
      inputNode: "",
      inputName: "",
      serachContain:''
    };
  },
  methods: {
    searchipt(){
      this.$emit('searchTxt',this.serachContain)
    },
    addlist() {
      if (!this.inputNode || !this.inputName) {
        alert("你是傻瓜");
        return;
      }

      let obj = {
        id: Math.random(),
        code: this.inputNode,
        productName: this.inputName,
        timer: new Date().toLocaleTimeString(),
      };
      this.$emit("submit", obj);

      this.inputName = "";
      this.inputNode = "";
    },
  },
};
</script>

<style>
#app {
  width: 600px;
  margin: 10px auto;
}

.tb {
  border-collapse: collapse;
  width: 100%;
}

.tb th {
  background-color: #0094ff;
  color: white;
}

.tb td,
.tb th {
  padding: 5px;
  border: 1px solid black;
  text-align: center;
}

.add {
  padding: 5px;
  border: 1px solid black;
  margin-bottom: 10px;
}
</style>